<template>
    <div>
        <div class="box">
            <div class="title">
                <p>{{ centreIndex + 1 }}、{{ centreName.name }}</p>
            </div>
            <div class="exam">
                <el-radio-group  v-model="choice" @change="choiseOption">
                    <template v-for="(item, index) in centreName.options" :key="index">
                        <ul>
                            <li>
                                <el-radio :label="item.id"><b>{{ optionText(index) }}</b> 、{{ item.text }}</el-radio>
                            </li>
                        </ul>
                    </template>
                </el-radio-group>
            </div>
        </div>
    </div>
</template>

<script>
import { answerConvert, rendomArrItem } from '@/util/disorganizeABCD'
export default {
    name: "",
    data() {
        return {

        }
    },
    props: ['centreIndex', 'centreName'],
    created() {

    },
    mounted() {

    },
    computed:{
        choice:{
            //选中标题处理
            get(){
                return this.centreName.choice
            },
            set(v){
                //此处只是为了解决v-model对该属性进行写入
            },
        },
    },
    methods:{
        //ABCDEF
        optionText(index){
           return answerConvert(index)
        },
        //展示ABCD
        choiseOption(value){
            this.$store.commit("exam/setListAnswer",{
                arrListId:this.centreName.id,
                answerId:value
            })
        },
        //打乱数组
        // disorganize(params){
        //   return  rendomArrItem(params)
        // },
    },
}
</script>
<style scoped lang="scss">
.box {
    .title {
        p {
            font-size: 20px;
            text-indent: 20px;
            margin: 30px 0;
        }
    }

    .exam {
        margin-top: 50px;
        padding-left: 10px;

        ul {
            margin-left: 10px;
            width: 100%;

            li {
                margin-top: 20px;

                // .el-radio {
                //     b {
                //         font-size: 18px;
                //     }
                // }
            }
        }
    }
}
img{
    height: 200px;
    position: absolute;
    right: 10px;
    top: 100px;
}
</style>